<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // while
        document.write('<h2>while</h2>')
        function createTable(options = { tr: 5, td: 3 }) {
            document.write(`<table border="1" width="100%">`);
            while (options.tr-- != 0) {
                let td = options.td;
                document.write(`<tr>`);
                while (td-- != 0) {
                    document.write(`<td>${td}</td>`)
                }
                document.write(`</tr>`)
            }
            document.write(`</table>`)
        }
        createTable({ tr: 5, td: 10 });
        // do while
        document.write('<h2>do while</h2>')
        function createStar(row = 5) {
            let star = 0;
            do {
                let n = 0;
                do {
                    document.write("*");
                } while (++n <= star);
                document.write("<br/>");
            } while (++star <= row);
        }
        createStar(10);

        // for
        document.write('<h2>for</h2>')
        function forCreateStar(row = 5) {
            for (let i = 0; i <= row; i++) {
                for (let j = 0; j < i; j++) {
                    document.write('*')
                }
                document.write('<br>')
            }
        }
        forCreateStar();

        document.write('<h2>杨辉三角</h2>');
        function createEl(row = 5){
            for(let i=1;i<row;i++){
                for(let j=row - i;j>0;j--){
                    document.write('<span style="color:#fff;">*</span>')
                }
                for(let k = i*2-1;k>0;k--){
                    document.write('*')   
                }
                document.write('<br>')
            }
        }
        
        createEl();
        // 引用类型循环
        // for...in...
        // for...of...
    </script>
</body>

</html>